<template>
  <el-table
    v-loading="isLoading"
    :data="tableData"
    highlight-current-row
    :header-cell-style="{
      backgroundColor: 'rgb(243, 246, 251)',
      fontWeight: 500,
      padding: '6px 0'
    }"
  >
    <el-table-column
      v-for="item in tableCols"
      :key="item.prop"
      :prop="item.prop"
      :width="item.width"
      :label="item.label"
      :type="item.type"
    />
    <slot name="otherTableCol" />
  </el-table>
</template>

<script>
export default {
  name: 'TableComponent',
  props: {
    // 表格数据源  必要
    tableData: {
      type: Array,
      default: () => []
    },
    // 表格的列 [{prop:'name',width:'100px',type:'index'/'selection'}]  必要
    tableCols: {
      type: Array,
      required: true
    },
    isLoading: {
      type: Boolean,
      default: false
    }
  }
}
</script>

<style scoped lang="scss"></style>
